<script lang="ts">
export default {
  name: 'HmiEditorView'
}
</script>

<script setup lang="ts">
import { ref, shallowRef } from 'vue'
import HmiParse from '@/views/hmi/HmiParse.vue'
import type { ExcelColumnData } from '@/types/hmi/ExcelColumnConfig'
import { ElMessage } from 'element-plus'
import HmiEditor from '@/views/hmi/HmiEditor.vue'

const protocolParsed = ref(false)
const protocolDataList = shallowRef<ExcelColumnData[]>([])

const handleParsedResult = (result: ExcelColumnData[] | undefined) => {
  if (!result || result.length <= 0) {
    ElMessage.warning({ message: '数据为空，请确定后提交', grouping: true })
    return
  }

  protocolDataList.value = result
  protocolParsed.value = true
}
</script>

<template>
  <div class="h-screen w-screen">
    <hmi-parse v-if="!protocolParsed" @parsed="handleParsedResult" />
    <hmi-editor v-else :protocol-data-list="protocolDataList" />
  </div>
</template>

<style scoped></style>
